<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

</body>
<script>
//菜单标识
let menus = [
  'employees',
  'departments'
]
console.log()

// 字符串数组
let asyncStrRoutes = [
  'employees',
  'settings',
  'permissions',
  'social_securitys',
  'approvals',
  'attendances',
  'salarys',
  'departments'
]
//目标1.对asyncStrRoutes,根据menus里面的内容的东西做过滤
// let filterStrRoutes = asyncStrRoutes.filter(k=>menus.includes(k))
// console.log(filterStrRoutes)

// console.log(filterStrRoutes)
// 对象数组
let asyncObjRoutes = [
  {name: 'employees'},
  {name: 'settings'},
  {name: 'permissions'},
  {name: 'social_securitys'},
  {name: 'approvals'},
  {name: 'attendances'},
  {name: 'salarys'},
  {name: 'departments'}
]

//目标2.对asyncObjRoutes,根据menus里面的内容的东西做过滤
// let filterStrRoutes = asyncObjRoutes.filter(k=>menus.includes(k.name))
// console.log(filterStrRoutes)

// console.log(filterObjRoutes)
// 复杂的对象数组
let asyncRoutes = [
  {children: [{name: 'employees'}]},
  {children: [{name: 'settings'}]},
  {children: [{name: 'permissions'}]},
  {children: [{name: 'social_securitys'}]},
  {children: [{name: 'approvals'}]},
  {children: [{name: 'attendances'}]},
  {children: [{name: 'salarys'}]},
  {children: [{name: 'departments'}]}
]
//目标3.asyncRoutes,根据menus里面的内容的东西做过滤
let filterStrRoutes = asyncRoutes.filter(k => menus.includes(k.children[0].name))
console.log(filterStrRoutes)
</script>
</html>
